<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>档案管理系统</title>
    <!-- Tell the browser to be responsive to screen width -->
    <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport">

    <link rel="stylesheet" href="/static/bootstrap/css/bootstrap.min.css">
    <link rel="stylesheet" href="/static/dist/css/font-awesome.min.css">
    <link rel="stylesheet" href="/static/dist/css/ionicons.min.css">
    <link rel="stylesheet" href="/static/dist/css/AdminLTE.min.css">
    <link rel="stylesheet" href="/static/dist/css/skins/all-skins.min.css">
    <link rel="stylesheet" href="/static/css/bootstrap-treeview.css">
    <link rel="stylesheet" href="/static/css/bootstrapValidator.min.css">
    <link rel="stylesheet" href="/static/css/bootstrap-table.min.css">
    <link rel="stylesheet" href="/static/layer/theme/default/layer.css">
    <link rel="stylesheet" href="/static/plugins/morris/morris.css">
    <link rel="stylesheet" href="/static/css/element-ui.css">
    <link rel="stylesheet" href="/static/webCss/sy.css?v=shujubuwqd12138">

    <!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
    <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
    <!--[if lt IE 9]>
    <script src="/static/plugins/ie9/html5shiv.min.js"></script>
    <script src="/static/plugins/ie9/respond.min.js"></script>
    <![endif]-->
</head>
<body class="hold-transition skin-blue" style="font-size: medium;background-color: #F4F6FA">

<div class="content row" id="yhgl" style="weight:500px;height: 770px">
    <div v-show="syShow">
        <div class="row" style="margin-top: 10px;margin-left: 20px;margin-right: 20px;height: 50%">
            <div class=" col-xs-7" style="height: 100%">
                <div class="box" style="border-radius: 15px;height: 400px;">
                    <div class="box-header with-border">
                        <h3 class="box-title" style="font-weight: bold">最新档案</h3>
                        <div class="box-tools pull-right">
                            <a href="javascript:void(0)" class="el-icon-more" aria-hidden="true" style="color: #434a50" @click="dajs" title="查看更多"></a>
                        </div>
                    </div>
                    <div class="box-body chart-responsive" style="padding-top: 0px">
                        <el-table :data="newTable" :show-header="true" style="width: 100%">
                            <el-table-column  :show-overflow-tooltip="true" prop="dabh" label="档案编号" style="color: #2A2A2A;font-family: PingFang SC">
                            </el-table-column>
                            <el-table-column prop="ajtm" label="案卷题名"  :show-overflow-tooltip="true">
                            </el-table-column>
                            <el-table-column prop="inputTime" label="录入时间">
                            </el-table-column>
                        </el-table>
                    </div>
                    <!-- /.box-body -->
                </div>
            </div>
            <div class=" col-xs-5">
                <div class="box" style="border-radius: 15px;height: 400px">
                    <div class="box-header with-border">
                        <h3 class="box-title" style="font-weight: bold">行业标准</h3>
                        <div class="box-tools pull-right">
                            <a href="javascript:void(0)" class="el-icon-more" aria-hidden="true" style="color: #434a50" @click="hybztz" title="查看更多"></a>
                        </div>
                    </div>
                    <div class="box-body chart-responsive" id="hybz">

                    </div>
                    <!-- /.box-body -->
                </div>
            </div>
        </div>
        <div class="row" style="margin: 20px">
            <div class=" col-xs-7">
                <div class="box" style="border-radius: 15px">
                    <div class="box-header with-border">
                        <h3 class="box-title" style="font-weight: bold">档案总览</h3>
                        <div class="box-tools pull-right">
                            <a href="javascript:void(0)" class="el-icon-more" aria-hidden="true" style="color: #434a50" @click="daylb" title="查看更多"></a>
                        </div>
                    </div>
                    <div class="box-body" style="height: 300px">
                        <div id="lczl" style="height: 300px;"></div>
                    </div>
                    <!-- /.box-body -->
                </div>
            </div>
            <div class=" col-xs-5">
                <div class="box" style="border-radius: 15px">
                    <div class="box-header with-border">
                        <h3 class="box-title" style="font-weight: bold">法律法规</h3>
                        <div class="box-tools pull-right">
                            <a href="javascript:void(0)" class="el-icon-more" aria-hidden="true" style="color: #434a50" @click="flfgtz" title="查看更多"></a>
                        </div>
                    </div>
                    <div class="box-body chart-responsive" style="height: 300px;">
                        <div class="row" id="flfg">

                        </div>
                    </div>
                    <!-- /.box-body -->
                </div>
            </div>
        </div>
    </div>
    <div v-show="newDaShow">
        <div class="box" style="border-radius: 15px">
            <div class="box-header with-border">
                <h3 class="box-title" style="font-weight: bold">更多档案</h3>
                <div class="box-tools pull-right">
                    <a href="javascript:void(0)" class="el-icon-back" aria-hidden="true" style="color: #434a50" @click="goback" title="返回"></a>
                    <!--<a href="javascript:void(0)" class="el-icon-more" aria-hidden="true" style="color: #434a50" @click="dajs" title="查看更多"></a>-->
                </div>
            </div>
            <div class="box-body chart-responsive" style="padding-top: 0px">
                <table class="table table-bordered table-hover text-center" id="daTable">

                </table>
            </div>
            <!-- /.box-body -->
        </div>
    </div>
</div>

<script src="/static/plugins/jQuery/jquery-2.2.3.min.js"></script>
<!-- Bootstrap 3.3.6 -->
<script src="/static/bootstrap/js/bootstrap.min.js"></script>
<!-- Slimscroll -->
<script src="/static/plugins/slimScroll/jquery.slimscroll.min.js"></script>
<!-- FastClick -->
<script src="/static/plugins/fastclick/fastclick.js"></script>

<!-- AdminLTE App -->
<script src="/static/dist/js/app.js"></script>
<!-- AdminLTE for demo purposes -->
<script src="/static/dist/js/demo.js"></script>
<!--tabs-->
<script src="/static/dist/js/app_iframe.js"></script>
<script src="/static/js/bootstrap-treeview.js"></script>
<script src="/static/js/bootstrapValidator.min.js"></script>
<script src="/static/js/bootstrap-table.min.js"></script>
<script src="/static/js/bootstrap-table-zh-CN.js"></script>
<script src="/static/js/vue.js"></script>
<script src="/static/js/vue-resource.min.js"></script>
<script src="/static/layer/layer.js"></script>
<script src="/static/js/myJs.js?v=shujubuwqd12138"></script>
<script src="/static/plugins/morris/morris.js"></script>
<script src="/static/plugins/Raphael/raphael.min.js"></script>
<script src="/static/js/element-ui.js"></script>
<!--<script src="/static/js/highcharts.js"></script>-->
<!--<script src="/static/js/exporting.js"></script>-->
<!--<script src="/static/js/highcharts-zh_CN.js"></script>-->
<!--<script src="/static/js/grid-light.js"></script>-->
<script src="/static/js/echarts.min.js"></script>
<script src="/static/js/newJs.js?v=shujubuwqd12138"></script>
<!--<script src="https://unpkg.com/element-ui/lib/index.js"></script>-->

<script type="text/javascript">
    newCss("/static/webCss/sy.css");
    var ids = new Array();
    var ids2 = new Array();
    var arr = new Array();
    var arr2 = new Array();
    var qt = 0;
    var kjda = new Array();
    var wsda = new Array();
    var kjNum;
    var wsNum;
    var da = new Array();

    function paramsMatter(value,row,index) {
        var span=document.createElement('span');
        span.setAttribute('title',value);
        span.innerHTML = value;
        return span.outerHTML;
    }

    function hybzClick(id){
        var u2 = '/hxbz/api/previewFg/'+id;
        top.addTabs({
            id: "63233",
            text: "PDF浏览器",
            icon: "fa fa-circle-o",
            url: "/static/pdf/web/viewer.html?file="+u2,
            targetType: "iframe-tab",
            close:true
        });
    }

    function flfgclick(id){
        var u = '/fglr/api/previewFg/'+id;
        top.addTabs({
            id: "63233",
            text: "PDF浏览器",
            icon: "fa fa-circle-o",
            url: "/static/pdf/web/viewer.html?file="+u,
            targetType: "iframe-tab",
            close:true
        });
    }

    var vue = new Vue({
        el: '#yhgl',
        data: {
            count:10,
            syShow:true,
            newDaShow:false,//最新档案展示
            newTable:null,
            newTable2:null,
            newUser:{
                name:null,
                dw:null,
                phone:null,
                roleId:null,
                account:null,
                password:null,
            }
        },
        methods: {
            hybztz:function(){
                //type = 1打开行业标准界面
                top.addTabs({
                    id: "190015",
                    text: "档案依据",
                    icon: "fa fa-tasks",
                    url: "dayj?type=1",
                    targetType: "iframe-tab",
                    close:true,
                });
            },
            flfgtz:function(){
                //type = 0打开法律法规界面
                top.addTabs({
                    id: "190015",
                    text: "档案依据",
                    icon: "fa fa-tasks",
                    url: "dayj?type=0",
                    targetType: "iframe-tab",
                    close:true,
                });
            },
            daylb:function(){
                this.$http.get('/queryYlbFlag').then(function (result) {
                    var data = result.data;
                    if(data.code == 200){
                        if(data.data == 2){
                            top.addTabs({
                                id: "90022",
                                text: "档案一览表",
                                icon: "fa fa-tags",
                                url: "daylb",
                                targetType: "iframe-tab",
                                close:true,
                            });
                        }else {
                            cxAlert("只有管理员才能查看档案统计")
                        }
                    }else {
                        cxAlert(data.mess);
                    }
                })
            },
            //返回
            goback:function(){
                this.newDaShow = false;
                this.syShow = true;
                this.count = 10;
            },
            dajs:function(){
                this.newDaShow = true;
                this.syShow = false;
                $("#daTable").bootstrapTable('destroy');
                $('#daTable').bootstrapTable({
                    url: '/newestDa',
                    contentType: "application/json; charset=UTF-8",
                    type: "GET",
                    dataType: 'json',
                    queryParamsType: "",
                    sortName : 'id',
                    sortOrder : 'desc',
                    singleSelect: true,
                    striped: true,
                    smartDisplay: false,
                    cache: false,
                    pagination: true,  //设置为 true 会在表格底部显示分页条。
                    paginationLoop: false, //设置为 true 启用分页条无限循环的功能。
                    pageSize: 10,//每页初始显示的条数
                    pageList: [10],
                    toolbar: "#addtool",
                    sidePagination: 'server',
                    queryParams: function (params) {
                        return {'pageNum': params.pageNumber, 'pageSize': params.pageSize,'sort':params.sortOrder};
                    },
                    toolbar: "#addtool",
                    columns: [ {
                        field: 'id',
                        title: '序号',
                        sortable : true,
                        formatter:paramsMatter
                    },{
                        field: 'dabh',
                        title: '档案编号',
                        formatter:paramsMatter
                    }, {
                        field: 'ajtm',
                        title: '案卷题名',
                        formatter:paramsMatter
                    }, {
                        field: 'inputTime',
                        title: '录入时间',
                        formatter:paramsMatter
                    }],
                    responseHandler: function (res) {  //后台返回的结果
                        if (res.code == "200") {
                            var data = res.data;
                            var NewData = [];
                            for (i = 0; i < data.data.length; i++) {
                                NewData.push(data.data[i]);
                            }
                            var data = {
                                rows: NewData,
                                total: data.total
                            };
                            return data;
                        }
                    }
                });
            },
            addUser: function () {
                var bootstrapValidator1 = $("#userForm").data('bootstrapValidator');
                bootstrapValidator1.validate();
                if(bootstrapValidator1.isValid()){
                    this.$http.post('/addUser',this.newUser,{emulateJSON:true}).then( function (result) {
                        var data = result.body;
                        if(data.code == 200){
                            cxAlertOk("添加成功");
                            $('#addUserModel').modal('hide');
                            $("#userTable").bootstrapTable('refresh');
                            this.newUser.name=null;
                            this.newUser.dw=null;
                            this.newUser.phone=null;
                            this.newUser.roleId=null;
                            this.newUser.account=null;
                            this.newUser.password=null;
                        }else{
                            cxAlert(data.mess);
                        }
                    })
                }
            }
        },
        created: function () {
        },
        mounted: function () {
            var that = this;
            //最新档案
            $.get('/newestDa?pageNum=1&pageSize=6&sort=desc').then(function (res) {
                if(res.code == 200){
                    that.newTable = res.data.data;
                }
            })
            $.get('/fglr/api/queryAll').then(function (res) {
                if(res.code == 200){
                    var data = res.data;
                    var code;
                    var index =5;
                    if(data.length < index){
                        index = data.length;
                    }
                    for(var i = 0;i < index;i++){
                        if(i == index-1){
                            code = `<div class="col-xs-12">
                            <a href="javascript:flfgclick(`+data[i].id+`)" id="flfg1" class="hybz"><i class="fa fa-circle-o" aria-hidden="true" style="color: #D4D4D4;padding-right: 20px"></i>`+data[i].name+`</a>
                        </div>
                        <div class="col-xs-12">
                            <i class="fa fa-ellipsis-v" aria-hidden="true" style="color: #D4D4D4;padding-right: 23px;position: relative;left: 4px"></i>
                            <span style="font-family: PingFangSC-Regular;font-size: 12px">颁布时间：<span style="color: #D82020">`+data[i].uploadtime+`</span></span>
                        </div>`;
                        }else {
                            code = `<div class="col-xs-12">
                            <a href="javascript:flfgclick(`+data[i].id+`)" id="flfg1" class="hybz"><i class="fa fa-circle-o" aria-hidden="true" style="color: #D4D4D4;padding-right: 20px"></i>`+data[i].name+`</a>
                        </div>
                        <div class="col-xs-12">
                            <i class="fa fa-ellipsis-v" aria-hidden="true" style="color: #D4D4D4;padding-right: 23px;position: relative;left: 4px"></i>
                            <span style="font-family: PingFangSC-Regular;font-size: 12px">颁布时间：<span style="color: #D82020">`+data[i].uploadtime+`</span></span>
                        </div>
                        <div class="col-xs-12">
                            <i class="fa fa-ellipsis-v" aria-hidden="true" style="color: #D4D4D4;padding-right: 23px;position: relative;left: 4px"></i>
                        </div>`;
                        }
                        $('#flfg').append(code);
                    }
                }
            })
            $.get('/dalr/api/queryDayilb').then(function (res) {
                if(res.code == 200){
                    var data = res.data;
                    var NewData = [];
                    for(i=0;i<data.length;i++){
                        var index = {
                            'dalxName':data[i].dalxName,
                            'dalx':data[i].dalx,
                        }
                        NewData.push(index);
                        var typeYears = data[i].typeYears;
                        for(var j = 0;j<typeYears.length;j++){
                            NewData[i][typeYears[j].year] = typeYears[j].count;
                        }
                    }
                    kjNum = NewData;
                    for(var i = 0;i < data.length;i++){
                        var da = data[i];
                        if(da.dalxName !== '科技档案'){
                            kjda.push(da.dalxName)
                        }
                    }
                    for(var j = 0;j < kjNum.length;j++){
                        var nf = kjNum[j];
                        if(nf.dalxName !== '科技档案'){
                            var zda = 0;
                            Object.keys(nf).forEach(key => {
                                if(key != 'dalxName' && key != 'dalx'){
                                    zda += nf[key];
                                }
                            });
                            arr.push(zda);
                        }
                    }
                    $.get('/dalr/api/queryDayilbWs').then(function (res) {
                        if(res.code == 200){
                            var data2 = res.data;
                            var NewData2 = [];
                            for(i=0;i<data2.length;i++){
                                var index = {
                                    'dalxName':data2[i].dalxName,
                                    'dalx':data2[i].dalx,
                                }
                                NewData2.push(index);
                                var typeYears = data2[i].typeYears;
                                for(var j = 0;j<typeYears.length;j++){
                                    NewData2[i][typeYears[j].year] = typeYears[j].count;
                                }
                            }
                            wsNum = NewData2;
                            for(var i = 0;i < data2.length;i++){
                                var da2 = data2[i];
                                if(da2.dalxName !== '文书档案'){
                                    wsda.push(da2.dalxName)
                                }
                            }
                            for(var j = 0;j < wsNum.length;j++){
                                var nf2 = wsNum[j];
                                if(nf2.dalxName !== '文书档案'){
                                    var zda2 = 0;
                                    Object.keys(nf2).forEach(key => {
                                        if(key != 'dalxName' && key != 'dalx'){
                                            zda2 += nf2[key];
                                        }
                                    });
                                    arr2.push(zda2);
                                }
                            }
                            arr.push.apply(arr,arr2);
                            kjda.push.apply(kjda,wsda);
                            //表格
                            $(function () {
                                var myChart = echarts.init(document.getElementById('lczl'));
                                // 指定图表的配置项和数据
                                var option = {
                                    title: {
                                        text: ''
                                    },
                                    tooltip: {},
                                    legend: {
                                        data:['档案数量']
                                    },
                                    xAxis: {
                                        type: 'category',
                                        boundaryGap: false,
                                        data: kjda
                                    },
                                    yAxis: {
                                        type: 'value'
                                    },
                                    series: [
                                        {
                                            name:'档案数量',
                                            type:'line',
                                            lineStyle:{
                                                color:'#9073FF' //折线颜色
                                            },
                                            areaStyle: {normal: {
                                                    color: new echarts.graphic.LinearGradient(
                                                        0, 0, 0, 1,
                                                        [
                                                            {offset: 0, color: '#CFC1FF'},
                                                            {offset: 0.5, color: '#CFC1FF'},
                                                            {offset: 1, color: '#ddd'}
                                                        ]
                                                    )
                                                }},
                                            data:arr
                                        }
                                    ]

                                };
                                // 使用刚指定的配置项和数据显示图表。
                                myChart.setOption(option);
                            })
                        }
                    });
            }
            });
            //行业标准
            $.get('/hxbz/api/queryAll').then(function (res) {
                if(res.code == 200){
                    var data = res.data;
                    var code;
                    var index;
                    if(data.length>=5){
                        index = 5;
                    }else {
                        index =  data.length;
                    }
                    for(var i = 0;i < index;i++){
                        code =`<div class="row hybzbk">
                        <img class="col-xs-1" src="/static/img/folder_open-24px.png"/>
                        <a href="javascript:hybzClick(`+data[i].id+`)" class="hybz2">`+data[i].name+`</a>
                    </div>`
                        $('#hybz').append(code);
                    }
                }
            });

        }
    });


</script>

</body>
</html>
